{% extends 'rbac/base.html' %}
{% block addcss %}
    <link href="/static/css/plugins/dropzone/basic.css" rel="stylesheet">
    <link href="/static/css/plugins/dropzone/dropzone.css" rel="stylesheet">
    <style>
        .others a {
            margin-right: 5px;
        }
    </style>
{% endblock %}

{% block content %}
    {% load menu %}
    {% breadcrumb request %}

    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-9">
                <div class="ibox float-e-margins">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="m-b-md">
                                    {% if  request|has_permission:upfile_url_name %}
                                        {{ btn|safe }}
                                    {% endif %}
                                    <h2>{{ obj.name }}</h2>
                                </div>

                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>项目中文名：</dt>
                                    </div>
                                    <div class="col-8 text-left">

                                        <dd class="mb-1"><a href="#" class="text-navy">{{ obj.cname }}</a></dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>部署方式：</dt>
                                    </div>
                                    <div class="col-8 text-left">
                                        <dd class="mb-1"><span class="label label-primary">{{ deploy_mode }}</span></dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>所属用户：</dt>
                                    </div>
                                    <div class="col-8 text-left">
                                        <dd class="mb-1">
                                            {% for user in upfile_obj.user.all %}
                                                {{ user.fullname }}&nbsp;&nbsp;
                                            {% endfor %}
                                        </dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>所属部门：</dt>
                                    </div>
                                    <div class="col-8 text-left">
                                        <dd class="mb-1">{{ obj.depart }}</dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>部署包名：</dt>
                                    </div>
                                    <div class="col-8 text-left">
                                        <dd class="mb-1"> {{ upfile_obj.file_name }}</dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-4 text-right">
                                        <dt>部署路径：</dt>
                                    </div>
                                    <div class="col-8 text-left">
                                        <dd class="mb-1"> {{ obj.deploy_path }}</dd>
                                    </div>
                                </dl>
                                <dl class="row mb-1">
                                    <div class="col-2 text-right">
                                    </div>
                                    <div class="col-4 ">
                                        <a href="javascript:window.location.reload()" class="btn btn-block btn-outline btn-primary">刷新</a>
                                    </div>
                                    <div class="col-6 text-left">
                                        <dd class="mb-1"></dd>
                                    </div>
                                </dl>
                            </div>
                            <div class="col-lg-6 ">
                                {% csrf_token %}
                                <div class="dropzone" id="myDropzone">
                                    <div class="am-text-success dz-message">
                                        将文件拖拽到此处<br>或点此打开文件管理器选择文件
                                    </div>
                                </div>
                                <br>
                                <div class="form-group row">
                                    <label class="col-lg-3 col-form-label text-danger"
                                           for="id_remark">更新备注
                                        *</label>

                                    <div class="col-lg-9">
                                        <input type="text" placeholder="请输入更新备注" class="form-control" name="remark"
                                               id="id_remark" required maxlength="256">
                                    </div>
                                </div>
                                <button type="button" id="btn-upfile"
                                        class="btn  btn-sm btn-primary float-right"
                                        style="margin-top: 5px">提交
                                </button>
                            </div>

                        </div>

                        <div class="row m-t-sm">
                            <div class="col-lg-12">
                                <div class="panel blank-panel">
                                    <div class="panel-heading">
                                        <div class="panel-options">
                                            <ul class="nav nav-tabs">
                                                <li><a class="nav-link active" href="#tab-1" data-toggle="tab">提交记录</a>
                                                </li>
                                                <li><a class="nav-link " href="#tab-2" data-toggle="tab">最新提交</a></li>
                                            </ul>
                                        </div>
                                    </div>

                                    <div class="panel-body">

                                        <div class="tab-content">

                                            <div class="tab-pane active" id="tab-1">
                                                <div class="feed-activity-list">
                                                    <div class="feed-element">
                                                        <a href="#" class="float-left">
                                                        </a>
                                                        {% for row in data_list %}
                                                            <div class="media-body ">
                                                                <div class="hr-line-dashed"></div>

                                                                <small class="float-right">{{ row.upload_time }}</small>
                                                                <strong>{{ row.deploy_user.fullname }}</strong> 发布上线
                                                                <div class="hr-line-dashed"></div>
                                                                <p class="">上线状态: &nbsp;
                                                                    {{ row.status|safe }}</p>
                                                                <p class="">上线备注: &nbsp;
                                                                    <strong>{{ row.remark }}</strong></p>
                                                                <p class="">部署包 : &nbsp;
                                                                    <strong><a class="btn btn-outline btn-link"
                                                                               href="/media/backfile/{{ obj.name }}/{{ row.backfile }}">{{ row.backfile }}</a></strong>
                                                                </p>
                                                                <p class="">上线文件: &nbsp;</p>
                                                                <div class="well">
                                                                    {{ row.file_info|safe }}
                                                                </div>
                                                                <p class="">上线日志: &nbsp;</p>
                                                                <small class="text-muted">{{ row.log.end_time }}</small>
                                                                <pre>{{ row.log.log }}</pre>

                                                            </div>
                                                        {% endfor %}

                                                    </div>
                                                </div>
                                                <div class="col-sm-12 clearfix">
                                                    <ul class="pagination float-right">
                                                        {{ pager.page_html|safe }}
                                                    </ul>
                                                </div>

                                            </div>
                                            <div class="tab-pane " id="tab-2">
                                                <div class="feed-activity-list">
                                                    <div class="feed-element">
                                                        <a href="#" class="float-left">
                                                        </a>
                                                        <div class="media-body ">
                                                            <small class="float-right">{{ upfile_info_new_obj.upload_time }}</small>
                                                            <strong>{{ upfile_info_new_obj.deploy_user.fullname }}</strong>
                                                            发布上线
                                                            <div class="hr-line-dashed"></div>
                                                            <p class="">上线状态: &nbsp;
                                                                <strong>{{ upfile_info_new_obj.status|safe }}</strong>
                                                            </p>
                                                            <p class="">上线备注: &nbsp;
                                                                <strong>{{ upfile_info_new_obj.remark }}</strong></p>
                                                            <p class="">部署包 : &nbsp;
                                                                <strong><a class="btn btn-outline btn-link"
                                                                           href="/media/backfile/{{ obj.name }}/{{ upfile_info_new_obj.backfile }}">{{ upfile_info_new_obj.backfile }}</a></strong>
                                                            </p>
                                                            <p class="">上线文件: &nbsp;</p>
                                                            <div class="well">
                                                                {{ upfile_info_new_obj.file_info|safe }}
                                                            </div>
                                                            <p class="">上线日志: &nbsp;</p>
                                                            <small class="text-muted">{{ upfile_info_new_obj.log.end_time }}</small>
                                                            <pre>{{ upfile_info_new_obj.log.log }}</pre>

                                                        </div>
                                                    </div>
                                                </div>


                                            </div>

                                        </div>

                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block addjs %}
    <script src="/static/js/plugins/dropzone/dropzone.js"></script>
    <script>


        Dropzone.autoDiscover = false;
        var myDropzone = new Dropzone("#myDropzone", {
            url: "{{ online_url }}",
            paramName: "file",
            addRemoveLinks: true,
            method: 'post',
            maxFiles: 1,
            maxFilesize: 8, // MB
            parallelUploads: 1,
            dictFileTooBig: "文件超过8MB!",
            dictRemoveFile: '删除文件',
            dictMaxFilesExceeded: "文件数量过多",
            filesizeBase: 1024,
            autoProcessQueue: false,
            sending: function (file, xhr, formData) {
                formData.append('remark', $('input[name="remark"]').val());
                formData.append("filesize", file.size);
                formData.append('csrfmiddlewaretoken', $('input[name="csrfmiddlewaretoken"]').val());

            },
            success: function (file, response) {
                if (response.error) {
                    $(file.previewTemplate).children('.dz-error-mark').css('opacity', '1')
                } else {
                    location.reload();
                }
            }
        });

        $(document).ready(function () {
            $('#btn-upfile').click(function () {
                myDropzone.processQueue();
            });

            $('#relaunch').on("click", function () {
                var upfileinfo = $(this).attr('upfileinfo');
                $.ajax({
                    url: '{% url "Arc:project_project_relaunch" pk=obj.pk %}',
                    type: 'POST',
                    data: {
                        'upfileinfo': upfileinfo,
                        'csrfmiddlewaretoken': $('input[name="csrfmiddlewaretoken"]').val(),
                    },
                    success: function (data) {
                        if (data['status']) {
                            window.location.reload()
                        } else {
                            alert(data['msg']);
                        }
                    },

                })
            })
        });
    </script>
{% endblock %}